<{include file="public/header" /}>

<style>
  .layui-table tbody tr:hover {
      background-color: transparent;
  }
  .layui-table-cell{
    height:auto;
    /*line-height:50;*/
    text-overflow: inherit;
    white-space: normal;
  }
</style>
<body>
        
<!-- <blockquote class="layui-elem-quote layui-text" style="margin-bottom: 0px;background-color: white">
  说明：请认真填写，不能修改！
</blockquote> -->

<!-- 选项卡开始 -->
<div class="layui-tab layui-tab-card" style="margin-top: -1px;">
  <ul class="layui-tab-title">
    <li class="layui-this">选择</li>
  </ul>
  <div class="layui-tab-content">
    <!-- 单选题选项卡1 -->
    <div class="layui-tab-item layui-show">
      <form class="layui-form" lay-filter="editform">
       <!--  单选还是多选 -->
        <div class="layui-form-item">
          <input type="radio" name="qtype" value="1" title="单选题" lay-filter="selecttype" checked>
          <input type="radio" name="qtype" value="2" title="多选题" lay-filter="selecttype">
        </div>
       <!-- 问题编辑框 -->
        <div class="layui-form-item">
          <textarea id="question" name="question" placeholder="问题题干" lay-verify="question" class="layui-textarea" ><{$qdata.qtitle}></textarea> 
        </div>

       <!--  选项编辑框 -->
        <table class="layui-table">
          <colgroup>
            <col width="70%">
            <col width="30%">
          </colgroup>
          <thead>
            <tr>
              <th><center>选择题选项</center></th>
              <th>是否正确答案</th>
            </tr> 
          </thead>
          <tbody>
            <tr>
              <td>
                <div class="layui-form-item">
                  <textarea id="answer1" name="answer[]" placeholder="选项1"  lay-verify="answer1" class="layui-textarea" ><{$qdata['getanswers'][0]['answercontent']}></textarea>
                  <input type="hidden" name="aids[]"  value="<{$qdata['getanswers'][0]['aid']}>">
                </div >
              </td>
              <td>
                <div class="layui-form-item">
                  <input type="checkbox" name="isright[]" value="1" title="是" <{$qdata['getanswers'][0]['isright']==1 ? 'checked' : ''}>>
                </div>
              </td>
            </tr>
            <tr>
              <td>
                <div class="layui-form-item">
                  <textarea id="answer2" name="answer[]" placeholder="选项2" lay-verify="answer2" class="layui-textarea" ><{$qdata['getanswers'][1]['answercontent']}></textarea>
                  <input type="hidden" name="aids[]"  value="<{$qdata['getanswers'][1]['aid']}>">
                </div >
              </td>
              <td>
                <div class="layui-form-item">
                  <input type="checkbox" name="isright[]" value="1" title="是" <{$qdata['getanswers'][1]['isright']==1 ? 'checked' : ''}>>
                </div>
              </td>
            </tr>
            <tr>
              <td>
                <div class="layui-form-item">
                  <textarea id="answer3" name="answer[]" placeholder="选项3" lay-verify="answer3" class="layui-textarea" ><{$qdata['getanswers'][2]['answercontent']}></textarea>
                  <input type="hidden" name="aids[]"  value="<{$qdata['getanswers'][2]['aid']}>">
                </div >
              </td>
              <td>
                <div class="layui-form-item">
                  <input type="checkbox" name="isright[]" value="1" title="是" <{$qdata['getanswers'][2]['isright']==1 ? 'checked' : ''}>>
                </div>
              </td>
            </tr>
            <tr>
              <td>
                <div class="layui-form-item">
                  <textarea id="answer4" name="answer[]" placeholder="选项4" lay-verify="answer4" class="layui-textarea" ><{$qdata['getanswers'][3]['answercontent']}></textarea>
                  <input type="hidden" name="aids[]"  value="<{$qdata['getanswers'][3]['aid']}>">
                </div >
              </td>
              <td>
                <div class="layui-form-item">
                  <input type="checkbox" name="isright[]" value="1"  title="是" <{$qdata['getanswers'][3]['isright']==1 ? 'checked' : ''}>>
                </div>
              </td>
            </tr>
             
          </tbody>
        </table>

          <div class="layui-form-item">
                <input type="hidden" name="qid" id="type" value="<{$qdata['qid']}>">
          </div>


          <div class="layui-form-item">
            <div class="layui-input-block">
              <button class="layui-btn" lay-submit id="select" lay-filter="select" type = "button">立即提交</button>
              <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
          </div>
          <div style="height: 150px;"></div>
      </form>
    </div>
    <!-- 单多选题选项卡结束1 -->
  </div>
</div>
<!-- 选项卡结束 -->

<script>

layui.use(['form','element','layer','jquery','layedit'], function(){
  var $ = layui.$,element = layui.element,form = layui.form,layer = layui.layer,layedit = layui.layedit;
  //----------上面引入layui下面开始业务，分割一下-----------------//
  //初始化富文本
  layedit.set({
    uploadImage: {
      url: "<{:url('upload/upimg')}>" //接口url
      ,type: '' //默认post
    }
  });
  var editquestion=layedit.build('question',{
    tool: ['image'],height:80
  });

  var editanswer1=layedit.build('answer1',{
    tool: ['image'],height:60
  });
  var editanswer2=layedit.build('answer2',{
    tool: ['image'],height:60
  });
  var editanswer3=layedit.build('answer3',{
    tool: ['image'],height:60
  });
  var editanswer4=layedit.build('answer4',{
    tool: ['image'],height:60
  });
  //layedit.setContent(editquestion, "<{$qdata['qtitle']}>|htmlspecialchars_decode");

  //提交表单的时候同步内容到 textarea
  form.verify({ 
            question: function(value) { return layedit.sync(editquestion); }
            ,answer1: function(value) { return layedit.sync(editanswer1); }
            ,answer2: function(value) { return layedit.sync(editanswer2); }
            ,answer3: function(value) { return layedit.sync(editanswer3); }
            ,answer4: function(value) { return layedit.sync(editanswer4); }
  });
  //选择单选多选时的提示
  form.on('radio(selecttype)', function(data){
    //console.log(data.elem); //得到radio原始DOM对象
    console.log(data.value); //被点击的radio的value值
    if (data.value==1) {
       layer.tips('单选题，只有一个正确答案！', data.othis,{tips: 1})
    } else {
        layer.tips('多选题，可以有多个正确答案！', data.othis);
    }
    
  });  
  
    
   //监听表单提交
  form.on('submit(select)', function(data){
      //console.log(data.field);

     // layer.alert(JSON.stringify(data.field), {
     //    title: '最终的提交信息'
     //  });
     
    //alert(layedit.getContent(editquestion));
        layer.confirm('确定提交?', {btn: ['提交','取消'],btnAlign: 'c', title:'请确认'}
        ,function(index){
          //do something
            $.post("<{:url('select_edit')}>",data.field,function(data,status){
              //alert(data);
              //alert(JSON.stringify(data));
             // console.log(data);
              if(data===1){
                //layer.close(index);
                layer.msg('提交成功!',function(){
                  x_father_close();
                   parent.location.reload();
                }); 
              }else{
                  layer.alert(data);
              }
                
              
           })
          
        });  
   });
  
// //初始化数据
  form.val("editform", {
    "qtype":"<{$qdata['qtype']}>"// "name": "value"    
  })

});


</script>

</body>
</html>